<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>前端19表单常用的控件</title>
</head>
<body>
    <form action="https://search.jd.com/search">
   <!-- value来控制默认值，maxlength来控制字符的长度 -->
   <!-- name后也是官方定义或者后端的搜索词 -->
    账户：<input type="text" name="accout" value="zhangsan" maxlength=""><br>
    密码：<input type="password" name="pwd"  value=""  maxlength=""><br>
    <!-- 不写value就没办法搜走数据,显示不出来我选择的选项 -->
    <!-- name后面不写的话数据没有名字,系统没办法搜集,
     也是用来将按钮划分到同一个属性,比如性别的数据命名为gender,男女都划分到gender
     让radio实现单选 ,radio为圆形状单选择,-->
    性别: 
        <input type="radio" name="gender" value="男">男
        <input type="radio" name="gender" value="女" checked>女<br>
    爱好:
    <!-- checkbox为方形状多选择按钮,划分在同一属性后也是多选,比如抽烟,喝酒,烫头都划分到hobby里 -->
    <input type="checkbox" name="hobby" value="somke" checked>抽烟
    <input type="checkbox" name="hobby" value="drink">喝酒
    <input type="checkbox" name="hobby" value="perm">烫头 
    <br>
    <!-- ,checked为默认选择,注意,单选择和多选择一顶要写value,不然搜集不到数据 -->
    
    <!-- 文本域标签textarea，cols为宽或者列，rows为高或者行 -->
    其他：
    <textarea name="other" cols="22" rows="3"></textarea>
    <br>
    籍贯：
    <!-- 下拉框，有value就收取数据value，没有就收取数据后面的文字,selected为这个下拉框的默认选择代码 -->
    <select name="place">
        <option value="冀">河北</option>
        <option value="鲁">山东</option>
        <option value="晋" selected>山西</option>
        <option value="粤">广东</option>
    </select>
    
    
    
    
    <!-- 隐藏域 ,用户看不见,用来检测官方或后端服务器的申请,如果不是前面俩个就会被驳回申请-->
     <input type="hidden" name="from" value="头条">
     <br>
    <!--取人按钮不加name
      确认按钮的第一种 -->
     <!-- <button>确认</button> -->
    <!-- 确认按钮的第二种,value来控制按钮显示 -->
     <!-- input的功能主要有type来控制, -->
     <input type="submit" value="提交">
    <!-- 重置第一种,重置到默认值-->
    <!-- <button type="reset">重置</button> -->
     <!-- <button></button>里面不写type的话默认为submit -->
    <!-- 第二种 -->
    <input type="reset" value="重置">

    <!-- 普通按钮 -->
     <button disabled type="button">检测账号是否存在</button>
    <!-- disabled可以用来禁选 -->

    </form>



</body>
</html>